<template>
  <a-empty :image="simpleImage" v-if="!treedataObj.id" :description="'请选择左侧试题后操作'" />
  <a-row :span="24" v-else :gutter="[16, 10]">
    <a-col :span="6">
      <label> 试题分数： </label>
      {{ treedataObj.tmfz ?? '--' }}
    </a-col>
    <a-col :span="6">
      <label> 最小得分单位： </label>
      {{ (isShowInfo && pySzInfoVO?.pydfgc) || '--' }}
    </a-col>
    <a-col :span="6">
      <label> 评阅模式： </label>
      {{ (isShowInfo && pymsEnum[`pyMs_${pySzInfoVO?.pyMs}`]) || '--' }}
    </a-col>
    <a-col :span="6">
      <label> 自评允许最大分差(含)： </label>
      {{ (isShowInfo && pySzInfoVO?.zpFc) || '--' }}
    </a-col>
    <a-col :span="6">
      <label> 双评分差： </label>
      {{ isShowInfo && pySzInfoVO?.pyMs == '2' ? pySzInfoVO?.spFc || '--' : '--' }}
    </a-col>
    <a-col :span="6" v-if="treedataObj?.tmlx === '多项选择题'">
      <label> 漏选得分类型（多项选择）： </label>
      {{
        (isShowInfo && dxlxOptions.find(ele => ele.value === pySzInfoVO?.dxlxScoreType)?.label) ||
        '--'
      }}
    </a-col>
    <a-col
      :span="6"
      v-if="pySzInfoVO?.dxlxScoreType == 'CUSTOM' && treedataObj?.tmlx === '多项选择题'"
    >
      <label> 漏选得分： </label>
      {{ (isShowInfo && pySzInfoVO?.dxlxCustomScore) ?? '--' }}
    </a-col>
    <a-col :span="24">
      <label> 评阅教师： </label>
      <a-tag
        color="#2db7f5"
        v-for="(item, index) in pySzInfoVO?.pySzJsfpList"
        :key="index"
        v-if="isShowInfo"
      >
        {{ item.jsxm }}({{ item.account }})
      </a-tag>
      <span v-else-if="pySzInfoVO?.pySzJsfpList?.length !== 0 || !isShowInfo">--</span>
    </a-col>
    <a-col :span="24">
      <div class="!flex flex-wrap" style="gap: 5px 5px">
        <label> 参考答案： </label>
        <span
          class="bg-lime-400 p-5px rounded text-white questionSort"
          v-for="(item, index) in pySzInfoVO?.pySzCkdaList"
          :key="index"
          v-html="item.ckda"
          :data-sort="pySzInfoVO?.pySzCkdaList?.length > 1 ? `${index + 1} : ` : ''"
          @click="previewImg($event)"
          v-if="isShowInfo"
        ></span>
        <span v-else-if="!pySzInfoVO?.pySzCkdaList?.length || !isShowInfo">--</span>
      </div>
    </a-col>
    <a-col :span="24">
      <div class="!flex flex-wrap" style="gap: 5px 0">
        <label> 得分点： </label>
        <a-tag
          color="#4bf762"
          v-for="(item, index) in pySzInfoVO?.pySzDfdList"
          :key="index"
          v-if="isShowInfo"
        >
          {{ item.sortNum }}:{{ item.contents }}。({{ item.dfdScore }}分)。
        </a-tag>
        <span v-else-if="!pySzInfoVO?.pySzDfdList?.length || !isShowInfo">--</span>
      </div>
    </a-col>
  </a-row>
  <div class="infobbuttom" v-if="treedataObj.id">
    <!-- (statuTypeBloon && userInfo.accountType != 'ADMIN') -->
    <a-button
      type="primary"
      @click="handelRevocation(treedataObj)"
      :disabled="
        statuTypeBloon ||
        (!machineReadableProblem.includes(treedataObj?.tmlx) &&
          treedataObj?.tmlx != '填空题' &&
          treedataObj.children &&
          !!treedataObj.children.length) ||
        ((treedataObj?.tmlx == '填空题' || machineReadableProblem.includes(treedataObj?.tmlx)) &&
          (!treedataObj.children || !treedataObj.children.length))
      "
    >
      设置
    </a-button>
    <a-tooltip :key="'#fadfvf'" title="新增子题" :color="'#fadfvf'">
      <a-button
        type="primary"
        :disabled="
          userInfo.accountType !== 'PYJS' ||
          statuTypeBloon ||
          machineReadableProblem.includes(treedataObj?.tmlx) ||
          treedataObj?.tmlx === '填空题' ||
          getIsBatchHasBloon
        "
        @click="AddChilNew(treedataObj)"
      >
        新增子题
      </a-button>
    </a-tooltip>
    <a-tooltip :key="'#fadfvf'" title="删除子题" :color="'#fadfvf'">
      <a-button
        danger
        :disabled="
          userInfo.accountType !== 'PYJS' ||
          statuTypeBloon ||
          (!!treedataObj.children && !!treedataObj.children.length) ||
          !treedataObj.customFlag ||
          treedataObj.customType !== 'PYZZ'
        "
        @click="handelDetale(treedataObj)"
      >
        删除子题
      </a-button>
    </a-tooltip>
    <a-button
      type="primary"
      @click="handelTeacher(treedataObj)"
      :disabled="
        (!machineReadableProblem.includes(treedataObj?.tmlx) &&
          treedataObj?.tmlx != '填空题' &&
          treedataObj.children &&
          !!treedataObj.children.length) ||
        (treedataObj?.tmlx == '填空题' &&
          (!treedataObj.children || !treedataObj.children.length)) ||
        machineReadableProblem.includes(treedataObj?.tmlx)
      "
    >
      新增评阅教师
    </a-button>
  </div>
</template>

<script lang="ts" setup>
// 判断是否是机读题
import { machineReadableProblem } from '../index'
import { createImgPreview } from '/@/components/Preview'

import { pymsEnum } from '/@/views/home/index/index'

import { onMounted, ref, watch, computed, h } from 'vue'
// 本地存储
import { useUserStore } from '/@/store/modules/user'
const userStore = useUserStore()
const userInfo = <any>computed(() => userStore.getUserInfo)

// 消息提示框
import { useMessage } from '/@/hooks/web/useMessage'
const { createMessage, createConfirm } = useMessage()
const getIsBatchHasBloon = computed(() => getIsBatchHasFun(props.treedataObj?.children || []))

const isShowInfo = computed(() => {
  return (
    machineReadableProblem.includes(props.treedataObj?.tmlx) ||
    props.treedataObj?.tmlx == '填空题' ||
    !props.treedataObj.children ||
    props.treedataObj?.children?.length == 0
  )
})

const getIsBatchHasFun = (data: any = []) => {
  let isBatchHasObj: any = false
  for (let i = 0; i < data.length; i++) {
    if (data[i].children && data[i].children.length) {
      isBatchHasObj = getIsBatchHasFun(data[i].children)
    }
    if (!data[i].customFlag || data[i].customType !== 'PYZZ' || isBatchHasObj) {
      return true
    }
  }
  return isBatchHasObj
}

//api
import { reviewGetPySzInfoByStId, pyzzOperateDel } from '/@/api/examinationAudit'

// 空状态
import { Empty } from 'ant-design-vue'
const AEmpty = Empty
const simpleImage = Empty.PRESENTED_IMAGE_SIMPLE
const props = defineProps({
  treedataObj: {
    type: Object,
    default: () => ({}),
  },
  statuTypeBloon: {
    type: Boolean,
    default: false,
  },
  kmdm: {
    type: String,
    default: '',
  },
})

const pySzInfoVO = ref<any>({})

function previewImg(event: Event | any) {
  if (event?.target?.tagName == 'IMG') {
    createImgPreview({
      imageList: [event.target?.src],
    })
  }
}

watch(
  () => props.treedataObj,
  async stObj => {
    if (!stObj.id) {
      return
    }
    let { code, data } = await reviewGetPySzInfoByStId({ stId: stObj.id, kmdm: props.kmdm })

    if (code == 200) {
      pySzInfoVO.value = data[0] || {}
      if (props.treedataObj.children?.length && data[0]?.pySzCkdaList.length) {
        let arr = props.treedataObj.children
        let sortArr: any[] = []
        let filterArr: any[] = []
        for (let i = 0; i < arr.length; i++) {
          filterArr = data[0].pySzCkdaList.filter(e => arr[i].id == e.stId)
          if (stObj.tmlx == '判断题') {
            filterArr[0].ckda =
              filterArr[0].ckda == 'true' || filterArr[0].ckda === true ? '√' : '×'
          }
          sortArr.push(...filterArr)
          filterArr = []
        }
        pySzInfoVO.value.pySzCkdaList = sortArr
      } else {
        if (stObj.tmlx == '判断题') {
          pySzInfoVO.value.pySzCkdaList[0].ckda =
            pySzInfoVO.value.pySzCkdaList[0].ckda == 'true' ||
            pySzInfoVO.value.pySzCkdaList[0].ckda === true
              ? '√'
              : '×'
        }
      }
    }
  },
  { deep: true, immediate: true }
)

const emit = defineEmits(['revocation', 'addChilNew', 'funTeacher', 'successFun'])

/**
 * 添加子题
 */
function AddChilNew(obj: Object) {
  emit('addChilNew', obj)
}
/**
 * 编辑/设置题目信息
 * @param {Object} obj 编辑题目对象
 */
function handelRevocation(obj: Object) {
  emit('revocation', obj)
}
/**
 * 自定义子题目
 * @param obj 删除题目对象
 */
function handelDetale(obj: any) {
  // 删除自定义试题
  createConfirm({
    iconType: 'warning',
    title: () => h('span', '温馨提醒'),
    content: () => h('span', '您确定删除吗？'),
    onOk: async () => {
      let { code, message } = await pyzzOperateDel({
        kmdm: props.kmdm,
        id: obj.id,
        sjtmid: obj.sjtmid,
      })
      if (code === 200) {
        createMessage.info('删除成功')
        emit('successFun')
      } else {
        createMessage.error(message)
      }
    },
  })
}

/**
 * 分配教师
 * @param {Object} obj 编辑题目对象
 */
function handelTeacher(obj: Object) {
  emit('funTeacher', obj)
}

import { getDictionaryList } from '/@/views/teacher/home/index'

const dxlxOptions = ref<any>([])

onMounted(async () => {
  await getDictionaryList('dxlxScoreType', dxlxOptions)
})
</script>

<style lang="less">
.questionSort {
  p {
    display: inline-block;
    margin: 0;
  }
  img {
    max-width: 60px !important;
    height: auto !important;
  }
  &::before {
    content: attr(data-sort);
  }
}

.infobbuttom {
  text-align: center;
  margin: 20px auto;
  button {
    margin-left: 10px;
  }
}
</style>
